<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="renderer" content="webkit"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,user-scalable=no"/>
	<title>网格</title>
	<!-- 基础css  -->
	<link rel="stylesheet" href="css/public.css" />
	<link rel="stylesheet" href="layui/css/layui.css" />
	<link rel="stylesheet" href="css/warning.css" />
	<!-- 首页css  -->
</head>
<body>
	<div class="wTop">
		<div class="wPublic">
			<a class="wTLogo" href="#this"><img src="images/logo.png"></a>
			<div class="fr">
				<a class="wTName" href="#this">
					<img src="images/name.png">
					<em>六小喵</em>
				</a>
				<a class="wTHome" href="#this" title="首页"><img src="images/home.png"></a>
				<a class="wTHome" href="#this" title="消息"><img src="images/news.png"><font>66</font></a>
				<a class="wTHome" href="#this" title="换肤"><img src="images/peeler.png"></a>
				<a class="wTHome" href="#this" title="退出"><img src="images/out.png"></a>
			</div>
		</div>
	</div>
	
	<!--内容-->
		<div class="wPublic">
			<ul class="waTop">
				<li class="layui-col-xs3 layui-col-md1"><a href="#this">预警报告</a><img src="images/arrow.png"></li>
				<li class="layui-col-xs3 layui-col-md1 cur"><a href="#this">预警监测</a><img src="images/arrow.png"></li>
				<li class="layui-col-xs3 layui-col-md1"><a href="#this">历史操作</a><img src="images/arrow.png"></li>
				<li class="layui-col-xs3 layui-col-md1"><a href="#this">名单下载</a><img src="images/arrow.png"></li>
			</ul>
			
			<!--搜索条件-->
				<div class="waPresentation">
					<div class="waPContent layui-col-md11">
						<div class="layui-col-xs12">
							<form class="layui-form waMonitor" action="">
								<div class="waPInput wapHide layui-col-xs12 layui-col-md2">
								   	<div class="layui-input-inline">
								      <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入学生姓名/学号" class="layui-input">
								    </div>
								</div>
								<div class="waPInput wapHide layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">全部学院</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">全部年级</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">全部学年</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">心理预警</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">预警级别</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">全部来源</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md2">
								    <div class="layui-input-inline">
								      <select name="interest" lay-filter="aihao">
								        <option value="0">在藉且在校学生</option>
								        <option value="1">阅读</option>
								        <option value="2">游戏</option>
								        <option value="3">音乐</option>
								        <option value="4">旅行</option>
								      </select>
								    </div>
								</div>
								<div class="waPInput layui-col-xs12 layui-col-md3">
									<button class="layui-btn layui-input-block waP-btn" lay-submit="" lay-filter="demo1">确定</button>
								</div>
						    </form>
						</div>
					</div>
				</div>
			<!--搜索条件 end-->
			
			<!--table-->
				<div class="waPresentation">
					<div class="waPContent layui-col-md11">
						<div class="waPButton ">
							<a class="waPCAdd" href="#this">+ 新增预警</a>
							<a class="waPCExport" href="#this">导出</a>
						</div>
						<div class="layui-form layui-table-body waTabel">
						  <table class="layui-table"  lay-filter="parse-table-demo">
						    <thead>
						      <!--tr>
						        <th>序号</th>
						        <th>姓名</th>
						        <th>学号</th>
						        <th>年级</th>
						        <th>学院</th>
						        <th>专业</th>
						        <th>预警来源</th>
						        <th>预警情况</th>
						        <th>预警时间</th>
						        <th>说明</th>
						        <th>操作</th>
						      </tr--> 
							   <tr>
							      <th lay-data="{field:'sign10',fixed: 'left', width:80}">昵称</th>
							      <th lay-data="{field:'sign1', width:150}">加入时间</th>
							      <th lay-data="{field:'sign2', width:300}">签名</th>
							      <th lay-data="{field:'sign3', width:300}">签名</th>
							      <th lay-data="{field:'sign4', width:300}">签名</th>
							      <th lay-data="{field:'sign5', width:300}">签名</th>
							      <th lay-data="{field:'sign6', width:300}">签名</th>
							      <th lay-data="{field:'sign7', width:300}">签名</th>
							      <th lay-data="{field:'sign8', width:300}">签名</th>
							      <th lay-data="{field:'sign9', width:300}">签名</th>
							      <th lay-data="{field:'sign0',fixed: 'right', width:100}">签名</th>
							    </tr> 
						    </thead>
						    <tbody>
						      <tr>
						        <td>1</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>2</td>
						        <td><a href="#this">苏童</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTOrange">橙色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>3</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTGules">红色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>4</td>
						        <td><a href="#this">亦舒</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTBlue">蓝色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>5</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>6</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>7</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>8</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>9</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						      <tr>
						        <td>10</td>
						        <td><a href="#this">王小波</a></td>
						        <td>142589</td>
						        <td>一年级</td>
						        <td>文学与新闻传播学院</td>
						        <td>新闻学</td>
						        <td>预警来源</td>
						        <td><font class="waSituation waTYellow">黄色预警</font></td>
						        <td>2017-5-25</td>
						        <td><a href="#this">查看</a></td>
						        <td><a class="waTEdit" href="#this"><img src="images/edit.png"></a><a class="waTDelete" href="#this"><img src="images/delete.png"></a></td>
						      </tr>
						    </tbody>
						  </table>
						  <div id="demo7"></div>
						</div>
					</div>
				</div>
			<!--table end-->
		
			
		</div>
	<!--内容 end-->
	<div class="waPopup">
		<div class="waContent">
			<div class="waCTitle ">
				<em>通用弹框</em>
				<font class="layui-layer-setwin">
					<a class="layui-layer-ico  layui-layer-close2" href="#this"></a>
				</font>
			</div>
			<form class="layui-form" action="">
			  <div class="layui-form-item">
			    <label class="layui-form-label">单行输入框</label>
			    <div class="layui-input-block">
			      <label class="layui-form-label">随便填充的文字</label>
			    </div>
			  </div>
			  
			  <div class="layui-form-item">
			    <label class="layui-form-label">单行选择框</label>
			    <div class="layui-input-block">
			      <select name="interest" lay-filter="aihao">
			        <option value=""></option>
			        <option value="0">写作</option>
			        <option value="1" selected="">阅读</option>
			        <option value="2">游戏</option>
			        <option value="3">音乐</option>
			        <option value="4">旅行</option>
			      </select>
			    </div>
			  </div>
		
			  <div class="layui-form-item">
			    <div class="layui-inline">
			      <label class="layui-form-label">分组选择框</label>
			      <div class="layui-input-inline">
			        <select name="quiz">
			          <option value="">请选择问题</option>
			          <optgroup label="城市记忆">
			            <option value="你工作的第一个城市">你工作的第一个城市</option>
			          </optgroup>
			          <optgroup label="学生时代">
			            <option value="你的工号">你的工号</option>
			            <option value="你最喜欢的老师">你最喜欢的老师</option>
			          </optgroup>
			        </select>
			      </div>
			    </div>
			    <div class="layui-inline">
			      <label class="layui-form-label">搜索选择框</label>
			      <div class="layui-input-inline">
			        <select name="modules" lay-verify="required" lay-search="">
			          <option value="">直接选择或搜索选择</option>
			          <option value="1">layer</option>
			          <option value="2">form</option>
			          <option value="3">layim</option>
			          <option value="4">element</option>
			          <option value="5">laytpl</option>
			          <option value="6">upload</option>
			          <option value="7">laydate</option>
			          <option value="8">laypage</option>
			          <option value="9">flow</option>
			          <option value="10">util</option>
			          <option value="11">code</option>
			          <option value="12">tree</option>
			          <option value="13">layedit</option>
			          <option value="14">nav</option>
			          <option value="15">tab</option>
			          <option value="16">table</option>
			          <option value="17">select</option>
			          <option value="18">checkbox</option>
			          <option value="19">switch</option>
			          <option value="20">radio</option>
			        </select>
			      </div>
			    </div>
			  </div>
			  
			  <div class="layui-form-item">
			    <label class="layui-form-label">联动选择框</label>
			    <div class="layui-input-inline">
			      <select name="quiz1">
			        <option value="">请选择省</option>
			        <option value="浙江" selected="">浙江省</option>
			        <option value="你的工号">江西省</option>
			        <option value="你最喜欢的老师">福建省</option>
			      </select>
			    </div>
			    <div class="layui-input-inline">
			      <select name="quiz2">
			        <option value="">请选择市</option>
			        <option value="杭州">杭州</option>
			        <option value="宁波" disabled="">宁波</option>
			        <option value="温州">温州</option>
			        <option value="温州">台州</option>
			        <option value="温州">绍兴</option>
			      </select>
			    </div>
			    <div class="layui-input-inline">
			      <select name="quiz3">
			        <option value="">请选择县/区</option>
			        <option value="西湖区">西湖区</option>
			        <option value="余杭区">余杭区</option>
			        <option value="拱墅区">临安市</option>
			      </select>
			    </div>
			  </div>
			  
			  <div class="layui-form-item">
			    <label class="layui-form-label">复选框</label>
			    <div class="layui-input-block">
			      <input type="checkbox" name="like[write]" title="写作">
			      <input type="checkbox" name="like[read]" title="阅读" checked="">
			      <input type="checkbox" name="like[game]" title="游戏">
			    </div>
			  </div>
			  
			  <div class="layui-form-item" pane="">
			    <label class="layui-form-label">原始复选框</label>
			    <div class="layui-input-block">
			      <input type="checkbox" name="like1[write]" lay-skin="primary" title="写作" checked="">
			      <input type="checkbox" name="like1[read]" lay-skin="primary" title="阅读">
			      <input type="checkbox" name="like1[game]" lay-skin="primary" title="游戏" disabled="">
			    </div>
			  </div>
			  
			  <div class="layui-form-item">
			    <label class="layui-form-label">开关-默认关</label>
			    <div class="layui-input-block">
			      <input type="checkbox" name="close" lay-skin="switch" lay-text="ON|OFF">
			    </div>
			  </div>
			  <div class="layui-form-item">
			    <label class="layui-form-label">单选框</label>
			    <div class="layui-input-block">
			      <input type="radio" name="sex" value="男" title="男" checked="">
			      <input type="radio" name="sex" value="女" title="女">
			      <input type="radio" name="sex" value="禁" title="禁用" disabled="">
			    </div>
			  </div>
			  <div class="layui-form-item layui-form-text">
			    <label class="layui-form-label">普通文本域</label>
			    <div class="layui-input-block">
			      <textarea placeholder="请输入内容" class="layui-textarea"></textarea>
			    </div>
			  </div>
			 
			  <div class="layui-form-item">
			    <div class="layui-input-block">
			      <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
			      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
			    </div>
			  </div>
			</form>
		</div>
	</div>
	
		
	<!--白名单详情弹出框-->
	<div class="whPopup">
		<div class="whPContent">
			<div class="whCTitle ">
				<em>白名单详情</em>
				<font class="layui-layer-setwin">
					<a class="layui-layer-ico  layui-layer-close2" href="#this"></a>
				</font>
			</div>
			<div class="hCContent">
                <dl class="hNav col-sm-6">
                  <dt class="text-upper">院系</dt>
                  <dd>经济学院</dd>
                  <dt class="text-upper">状态</dt>
                  <dd>在校</dd>
                  <dt class="text-upper">辅导员</dt>
                  <dd>吴筠笕,王媛媛</dd>
                  <dt class="text-upper">年级</dt>
                  <dd>2015</dd>
                  <dt class="text-upper">一卡通</dt>
                  <dd>43158</dd>
                  <dt class="text-upper">学生类型</dt>
                  <dd>本科</dd>
                </dl>
                <dl class="hNav col-sm-6">
                  <dt class="text-upper">班级</dt>
                  <dd>金融1506班</dd>
                  <dt class="text-upper">专业</dt>
                  <dd>金融学专业</dd>
                  <dt class="text-upper">学号</dt>
                  <dd><a href="#this">201521063238</a></dd>
                  <dt class="text-upper">辅导员号</dt>
                  <dd>2015110148,2011061</dd>
                  <dt class="text-upper">入学年度</dt>
                  <dd>2015</dd>
                  <dt class="text-upper">挂科数</dt>
                  <dd>0</dd>
                </dl>
              </div>
              <div class="whPCButton">
             	 <button class="layui-btn waP-btn "  lay-filter="demo1">确定</button>
              </div>
		</div>
	</div>
	<!--白名单详情弹出框 end-->
	<!--底部-->
	<div class="wFooter">
		<p>中国·湖北·武汉市洪山区民族大道182号 027-67842763,027-87532233</p>
		<p>版权所有© 2016 江汉大学 鄂ICP备05003346号 邮编 430074</p>
	</div>
	<!-- 引入 echarts.js -->
	<script src="js/jquery-1.8.3.min.js"></script>
	<script src="layui/layui.js" charset="utf-8"></script>
    <script>
    	$(function(){
    		layui.use(['laypage','layedit','laydate','layer','form','table'], function(){
			  var laypage = layui.laypage
			  ,layer = layui.layer
			  ,table = layui.table
			  ,layedit = layui.layedit;

			  
			  //完整功能
			  laypage.render({
			    elem: 'demo7'
			    ,count: 150
			    ,layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
			    ,jump: function(obj){
			      //console.log(obj)
			    }
			  });
			  
			  //表单
			  var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
			  
			  
			  
			  //监听提交
			  form.on('submit(demo1)', function(data){
			    layer.alert(JSON.stringify(data.field), {
			      title: '最终的提交信息'
			    })
			    return false;
			  });
			  
			  //但是，如果你的HTML是动态生成的，自动渲染就会失效
			  //因此你需要在相应的地方，执行下述方法来手动渲染，跟这类似的还有 element.init();
			  table.init('parse-table-demo', { //转化静态表格
    	        //height: 'full-500'
    	      });
			  
			  //通用弹框
			  $('.waTEdit').live("click",function(){
    				$(".waPopup").fadeIn();
    		  });
			  $('.waCTitle  a').live("click",function(){
    				$(".waPopup").fadeOut();
    		  });
    		  
    		  //白名单详情弹框
			  $('').live("click",function(){
    				$(".whPopup").fadeIn();
    		  });
			  $('.whCTitle  a,.whPCButton .layui-btn').live("click",function(){
    				$(".whPopup").fadeOut();
    		  });
    		  
			  form.render();
			});   
		});
    </script>
</body>
</html>
